<template>
	<view style="background-color: #00a8ff;height: 100vh;">
		<u-navbar :is-back="true" title="登录" :background="{backgroundColor: '#00a8ff'}" :border-bottom="false">
			<view class="navbar-right" slot="right">
				<text style="color: #FFFFFF;margin-right: 20rpx;" color="#ffffff" @click="skip()">跳过</text>
			</view>
		</u-navbar>

		<view class="card_text u-p-60">
			<view class="big">
				Hello
			</view>
			<view class="big">
				欢迎来到美蜂医生版
			</view>
			<view class="small">
				此APP仅为入驻美蜂平台的认证医生提供服务
			</view>
		</view>

		<view class="u-p-60">
			<u-input v-model="cellPhone" type="text" :border="false" placeholder="请输入您的手机号" class="input_c"
				placeholderStyle="color:#ffffff" />
			<u-input v-model="code" type="text" :border="false" placeholder="请输入验证码" class="input_c"
				placeholderStyle="color:#ffffff"  />
				<text @click="count" v-show="!Fa" style="color: #FFFFFF;position: relative;top: -60rpx;float: right;">
					获取验证码</text>
				<u-count-down v-show="Fa" :timestamp="timestamp" :show-hours="false" style="color: #FFFFFF;position: relative;top: -60rpx;float: right;" :show-minutes="false" :autoplay="true"></u-count-down>
			<u-input v-model="InvitationCode" type="text" :border="false" placeholder="邀请码(选填)" class="input_c"
				placeholderStyle="color:#ffffff" />
		</view>


		<view class="u-p-60">
			<button
				style="background-color: #FFFFFF;width: 100%;border-radius: 60rpx;color: #00a8ff;font-size: 30rpx;margin-bottom: 20rpx;"
				@click="login()">医生登录</button>
			<view class="al_text">
				登录注册即代表同意《美蜂医生服务协议》《隐私政策》
			</view>
			<view class="al_text">
				未注册手机号将创建美蜂账号
			</view>
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				timestamp: 86400,
				cellPhone: '',
				code: '',
				InvitationCode: '',
				Fa:''
			};
		},
		methods: {
			skip() {
				console.log("跳过操作");
			},
			count(){
				console.log("获取验证码");
				this.Fa=true;
				console.log("获取验证码");
				if(this.cellPhone!=''){
					this.$apiVipCentre.send({
						mobile:this.cellPhone,
						event:"mobilelogin"
					}).then((res) => {
						console.log('request data data', res.data.data);
					}).catch((err) => {
						console.log('request fail', err);
					})
				}
			},
			login() {

				if (this.cellPhone != '' && this.code != '') {
					this.$api.login({
						account: this.cellPhone,
						password: this.code
					}).then((res) => {
						console.log('request success', res)
						console.log(res.data)
						uni.setStorageSync('userInfo', res.data.data.userinfo);
						
						console.log(uni.getStorageSync('userInfo'))
						
						// console.log(res.data.data.userinfo);
						setTimeout(()=>{
							uni.switchTab({
								url: '/pages/tabBar/index/index'
							})
						},2000)
						// 登陆成功，跳转
					

					}).catch((err) => {
						this.loading = false;
						uni.showToast({
							title:'账号或密码错误，发生了一个未知bug'
						})
						console.log('request fail', err);
					})
				}else{
					uni.showToast({
						title:"不能为空"
					})
				}
			}
		}
	}
</script>
<style lang="scss" scoped>
	.card_text {
		color: #FFFFFF;

		.big {
			font-size: 50rpx;
		}

		.small {
			font-size: 22rpx;
		}
	}

	.input_c {
		border-bottom: 1rpx solid #FFFFFF;
		color: #FFFFFF;
		padding: 165rpx 0;
		font-size: 24rpx;
	}

	.al_text {
		text-align: center;
		color: #FFFFFF;
		font-size: 20rpx;
	}
</style>
